<template>
	<div>
		<!-- 忘记密码 -->
		<customHeader middleTitle="修改密码" />

		<form class="form">
			<view class="form-group jus">
				<span>新密码</span>
				<input v-model="username" type="text" placeholder="" class="username" />
			</view>
			<view class="form-group jus">
				<span>确认密码</span>
				<input v-model="yan" type="yan" placeholder="" class="yan" />

			</view>
			<view class="form-group yu">
				<button type="button" @click="zhuce"
					:class="{ 'btn1': !isNextButtonRed, 'btn2': isNextButtonRed }">确认</button>
			</view>
		</form>

	</div>
</template>

<script>
	import {
		request,
		showToast
	} from "../../utils/api.js"
	import customHeader from "../../components/header/header.vue"
	export default {
		data() {
			return {
				username: '',

				yan: '',
				neng: true,
				count: 60, // 初始倒计时秒数
				counting: false, // 是否正在倒计时
				sent: false // 是否已经发送过验证码
			}
		},
		computed: {
			buttonText() {
				return this.counting ? `${this.count}s` : this.sent ? '重新发送验证码' : '发送验证码';
			},
			// 计算属性：检查username和yan是否都有值
			isNextButtonRed() {
				return this.username !== '' && this.yan !== '';
			}
		},

		methods: {

			zhuce() {

				const data = {
					password: this.yan,

					phoneNum: this.$route.query.username
				}
				if (!/^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{6,14}$/.test(this.yan)) {
					showToast('密码长度为6-14位英文、数字组合');

				} else {
					if (this.username == this.yan) {
						//发送修改密码请求
						request('/app/setting/resetPwd.do', 'POST', data).then((res) => {
							if (res.code == 1) {
								showToast(res.msg)
							}
							if (res.code == 1) {
								showToast(res.msg)
								uni.navigateTo({
									url: '/pages/verification/verification'
								});
							}

						}).catch((err) => {
							console.log(err);
						})

					} else {
						showToast('俩次密码输入不一致');
					}
				}




			}
		},
		components: {
			customHeader
		}
	}
</script>

<style lang="scss" scoped>
	@import "delpassword.scss"
</style>